<%--
  Created by IntelliJ IDEA.
  User: 29754
  Date: 2021/3/22
  Time: 21:42
  To change this template use File | Settings | File Templates.
--%>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <base href="<%=basePath %>"/>
    <link rel="stylesheet" type="text/css" href="static/themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="static/themes/icon.css">
    <link rel="stylesheet" type="text/css" href="static/demo.css">
    <link rel="stylesheet" type="text/css" href="static/themes/color.css">
    <script type="text/javascript" src="static/jquery.min.js"></script>
    <script type="text/javascript" src="static/jquery.easyui.min.js"></script>
    <script type="text/javascript">
        $(function () {
            //初始化表格
            $('#marriedTable').datagrid({
                url:'marriedPerson/showMarried',
                pagination:true,//在表格中显示分页工具栏，将此属性设置为true，就会发送ajax分页请求获取要加载的数据
                rownumbers:true,//显示行号
                pageNumber:1,//设置ajax分页查询的默认页码数
                pageSize:2,//设置每页显示的数量
                checkOnSelect:false,//设置点击行的任意位置不会选择该行，只有点击复选框时菜单选择
                pageList:[2,4,6],//设置每页数据量下拉框框中的数据
                title:"查询结果",//显示标题
                columns:[[
                    {field:'pid',title:'编号',width:100},
                    {field:'pname',title:'名称',width:100},
                    {field:'pmail',title:'邮箱',width:100,align:'right'},
                    {field:'phone',title:'手机号',width:100},
                    {field:'regdate',title:'注册时间',width:100,
                        formatter:function (value,rows,rowIndex) {
                            return value.year+"-"+value.monthValue+"-"+value.dayOfMonth+" "
                                +value.hour+":"+value.minute+":"+value.second;
                        }
                    },
                    {field:'status',title:'账号状态',width:100,align:'right'}
                    ]]});

        })
        //动态分页查询
        $(function () {
            $("#marriedSearch").click(function () {
               $("#marriedTable").datagrid("load",{
                   pname:$("#pname").val(),
                   phone:$("#phone").val(),
               })
            })
        })
    </script>
</head>
<body>
<div id="p" class="easyui-panel" title="新人管理"
     style="width:98%;height:98%;padding:5px;background:#fafafa;">
    <div style="margin: auto;width: 700px;">
        <form id="marriedForm" method="post">
                <input id="pname" class="easyui-textbox" type="text" prompt="新人名称" style="width:100px"
                       name="pname" />

                <input id="phone" class="easyui-textbox" type="text" prompt="新人手机号" style="width:100px"
                       name="phone" />
            <a id="marriedSearch" href="javascript:void (0)" class="easyui-linkbutton" data-options="iconCls:'icon-search'">
                查询
            </a>
        </form>
    </div>
    <table id="marriedTable"></table>
</div>


</body>
</html>
